{extend name="common@public/base" /}
{block name="title"}
<title>用户信息编辑_{:confv('title')}</title>
<meta name="keywords" content="index,会员中心首页,{:confv('keywords')}">
<meta name="description" content="{:confv('description')}">
{/block}

{block name="pjax_container"}
<div class="content">

	<div class="row">
		<div class="col-sm-12">

			<div class="nav-tabs-custom">
                <ul class="nav nav-tabs">
                    <li class="active"><a href="#tab1" data-toggle="tab">基本参数</a></li>
                    <li><a href="#tab2" data-toggle="tab">修改密码</a></li>
                    <li><a href="#tab3" data-toggle="tab">修改头像</a></li>
                    <li class="pull-right"><a href="javascript:history.back(-1)" class="btn btn-sm" style="padding:10px 2px;"><i class="fa fa-reply"></i> 返回</a></li>
                </ul>
                <div class="tab-content">
                    <div class="tab-pane active" id="tab1">
                        <form class="form-horizontal" method="POST" action="" onsubmit="return false" >
                            <input type="hidden" name="id" value="{$user['id']}" />
                            <input type="hidden" name="actions" value="user" />
                            <div class="form-group">
                                <label class="col-sm-2 control-label">用户名</label>
                                <div class="col-sm-7">
                                	<input class="form-control" disabled="disabled" value="{$user['username']}" placeholder="用户名">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">姓名</label>
                                <div class="col-sm-7">
                                	<input class="form-control" name="name" value="{$user['name']}" placeholder="姓名">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 col-xs-12 control-label">邮箱</label>
                                <div class="col-sm-7 col-xs-9">
                                	<input class="form-control" name="email" value="{$user['email']}" placeholder="邮箱">
                                </div>
                                <div class="col-sm-2 col-xs-3 x-pl-0">
                                	<select class="form-control x-plr-5" name="row[email_is_share]">
                                        <option value="1" {eq name="$user['is_share']['email_is_share']" value="1"} selected="selected"{/eq}>公开</option>
                                        <option value="0" {eq name="$user['is_share']['email_is_share']" value="0"} selected="selected"{/eq} >保密</option>
                                    </select>
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 col-xs-12 control-label">手机号码</label>
                                <div class="col-sm-7 col-xs-9">
                                	<input class="form-control" name="moblie" value="{$user['moblie']}" placeholder="手机号码">
                                </div>
                                <div class="col-sm-2 col-xs-3 x-pl-0">
                                	<select class="form-control x-plr-5" name="row[moblie_is_share]">
                                        <option value="1" {eq name="$user['is_share']['moblie_is_share']" value="1"} selected="selected"{/eq}>公开</option>
                                        <option value="0" {eq name="$user['is_share']['moblie_is_share']" value="0"} selected="selected"{/eq} >保密</option>
                                    </select>
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 col-xs-12 control-label">性别</label>
                                <div class="col-sm-7 col-xs-9">
                                    <select class="form-control select2" name="sex" style="width:100%;">
                                        <option value="1" {eq name="$user['sex']" value="1"} selected="selected"{/eq}>男</option>
                                        <option value="0" {eq name="$user['sex']" value="0"} selected="selected"{/eq} >女</option>
                                    </select>
                                </div>
                                <div class="col-sm-2 col-xs-3 x-pl-0">
                                	<select class="form-control x-plr-5" name="row[sex_is_share]">
                                        <option value="1" {eq name="$user['is_share']['sex_is_share']" value="1"} selected="selected"{/eq}>公开</option>
                                        <option value="0" {eq name="$user['is_share']['sex_is_share']" value="0"} selected="selected"{/eq} >保密</option>
                                    </select>
                                </div>
                            </div>
                            <div class="form-group hide">
                                <label class="col-sm-2 control-label">状态</label>
                                <div class="col-sm-7">
                                    <select class="form-control select2" name="status" style="width:100%;">
                                        <option value="1" {eq name="$user['status']" value="1"} selected="selected"{/eq} >在用</option>
                                        <option value="0" {eq name="$user['status']" value="0"} selected="selected"{/eq} >停用</option>
                                    </select>
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 col-xs-12 control-label">QQ</label>
                                <div class="col-sm-7 col-xs-9">
                                	<input class="form-control" name="qq" value="{$user['userinfo']['qq']}" placeholder="QQ">
                                </div>
                                <div class="col-sm-2 col-xs-3 x-pl-0">
                                	<select class="form-control x-plr-5" name="row[qq_is_share]">
                                        <option value="1" {eq name="$user['is_share']['qq_is_share']" value="1"} selected="selected"{/eq}>公开</option>
                                        <option value="0" {eq name="$user['is_share']['qq_is_share']" value="0"} selected="selected"{/eq} >保密</option>
                                    </select>
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 col-xs-12 control-label">微信号</label>
                                <div class="col-sm-7 col-xs-9">
                                	<input class="form-control" name="weixin" value="{$user['userinfo']['weixin']}" placeholder="微信号">
                                </div>
                                <div class="col-sm-2 col-xs-3 x-pl-0">
                                	<select class="form-control x-plr-5" name="row[wx_is_share]">
                                        <option value="1" {eq name="$user['is_share']['wx_is_share']" value="1"} selected="selected"{/eq}>公开</option>
                                        <option value="0" {eq name="$user['is_share']['wx_is_share']" value="0"} selected="selected"{/eq} >保密</option>
                                    </select>
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 col-xs-12 control-label">生日</label>
                                <div class="col-sm-7 col-xs-9">
                                    <input class="form-control timepicker" name="birthday" value="{$user['userinfo']['birthday_turn']}" placeholder="生日" >
                                </div>
                                <div class="col-sm-2 col-xs-3 x-pl-0">
                                	<select class="form-control x-plr-5" name="row[birthday_is_share]">
                                        <option value="1" {eq name="$user['is_share']['birthday_is_share']" value="1"} selected="selected"{/eq}>公开</option>
                                        <option value="0" {eq name="$user['is_share']['birthday_is_share']" value="0"} selected="selected"{/eq} >保密</option>
                                    </select>
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label ">用户简介</label>
                                <div class="col-sm-9">
                                	<textarea class="form-control" name="info" placeholder="用户简介">{$user['userinfo']['info']}</textarea>
                                </div>
                            </div>
                            <div class="form-group">
                                <div class="col-sm-2"></div>
                                <div class="col-sm-7">
                                    <div class="btn-group pull-right">
                                        <button type="submit" class="btn btn-info pull-right submits" data-loading-text="&lt;i class='fa fa-spinner fa-spin '&gt;&lt;/i&gt; 提交保存">提交保存</button>
                                    </div>
                                    <div class="btn-group pull-left">
                                        <button type="reset" class="btn btn-warning">撤销</button>
                                    </div>
                                </div>
                            </div>
                            <div class="form-group ">
                                <label class="col-sm-2 col-xs-3 control-label text-center x-lh-34">登陆次数</label>
                                <div class="col-sm-4 col-xs-9">
                                	<input class="form-control" disabled="disabled" value="{$user['logins']}" placeholder="登陆次数">
                                </div>
                            </div>
                            <div class="form-group ">
                                <label class="col-sm-2 control-label">注册时间</label>
                                <div class="col-sm-4 ">
                                	<input class="form-control" disabled="disabled" value="{$user['last_time_turn']}" placeholder="创建时间">
                                </div>
                                <label class="col-sm-2 control-label">注册IP</label>
                                <div class="col-sm-3">
                                	<input class="form-control" disabled="disabled" value="{$user['last_ip']}" placeholder="注册IP">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">最近登录</label>
                                <div class="col-sm-4">
                                	<input class="form-control" disabled="disabled" value="{$user['last_time_turn']}" placeholder="最后登录时间">
                                </div>
                                <label class="col-sm-2 control-label">登录IP</label>
                                <div class="col-sm-3">
                                	<input class="form-control" disabled="disabled" value="{$user['last_ip']}" placeholder="最后登录IP">
                                </div>
                            </div>
                            <div class="form-group hide">
                                <label class="col-sm-2 control-label">编辑时间</label>
                                <div class="col-sm-7">
                                	<input class="form-control" disabled="disabled" value="{$user['update_time']}" placeholder="编辑时间">
                                </div>
                            </div>
                        </form>
                    </div>

                    <div class="tab-pane" id="tab2">
                        <form class="form-horizontal" method="POST" action="" onsubmit="return false" >
                            <input type="hidden" name="id" value="1" />
                            <input type="hidden" name="actions" value="password" />
                            <div class="form-group hide">
                                <label class="col-sm-2 control-label">旧密码</label>
                                <div class="col-sm-7">
                                	<input class="form-control" name="oldpassword" value="" placeholder="旧密码" type="password">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">新密码</label>
                                <div class="col-sm-7">
                                	<input class="form-control" name="password" value="" placeholder="新密码" type="password">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">确认密码</label>
                                <div class="col-sm-7">
                                	<input class="form-control" name="repassword" value="" placeholder="确认密码" type="password">
                                </div>
                            </div>
                            <div class="form-group">
                                <div class="col-sm-2"></div>
                                <div class="col-sm-7">
                                    <div class="btn-group pull-right">
                                        <button type="submit" class="btn btn-info pull-right submits" data-loading-text="&lt;i class='fa fa-spinner fa-spin '&gt;&lt;/i&gt; 提交保存">提交保存</button>
                                    </div>
                                    <div class="btn-group pull-left">
                                        <button type="reset" class="btn btn-warning">撤销</button>
                                    </div>
                                </div>
                            </div>
                        </form>
                    </div>

                    <div class="tab-pane" id="tab3">
                        <div class="form-horizontal">
                            <div class="form-group text-center">
                            	<div class="col-sm-6 col-xs-6 x-mb-5">
                            		<label class="control-label">当前头像</label>
                            	</div>
                            	<div class="col-sm-6 col-xs-6 x-mb-5">
                            		<label class="control-label">微信二维码</label>
                            	</div>

                                <div class="col-sm-6 col-xs-6">
                                    <div class="avatar-view"  data-toggle="modal" data-target="#mytouxiang" data-title="上传头像" data-imgtype="tx" title="点击修改图片">
                                        <img class="img-rounded " style="max-height:200px;max-width:100%" src="{$user['userinfo']['avatar']}" alt="avatar">
                                    </div>
                                </div>

                                <div class="col-sm-6 col-xs-6">
                                    <div class="avatar-view"  data-toggle="modal" data-target="#mytouxiang" id="dqwximg" data-title="上传二维码" data-imgtype="wx" title="点击修改图片">
                                        <img class="img-rounded" style="max-height:200px;max-width:100%" src="{$user['userinfo']['wx_imgurl_turn']}" alt="avatar">
                                    </div>
                                </div>

                            </div>
                        </div>
                    </div>

                </div>
            </div>


		</div>
	</div>

</div>
<!--上传头像-->
<div class="modal fade" id="mytouxiang" data-backdrop="false">
    <div class="modal-dialog ">
        <form class="form-horizontal" method="POST" action="" onsubmit="return false" enctype="multipart/form-data">
        <input name="id" value="{$user['id']}" type="hidden"/>

        <div class="modal-content">
            <div class="modal-header bg-primary">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="myModalLabel"></h4>
            </div>
            <div class="modal-body">
            	<div class="x-mb-10">
            		<button class="x-dwr btn btn-warning ">选择图片
				    	<input type="file" id="inputImage" class="btn x-dwa-lt x-tm0" name="file" accept="image/*">
					</button>
            	</div>
            	<div class="row">
					<div class="col-sm-8 x-mb-10">
						<div id="cjimgdata" style="width:100%; max-height:350px;"></div>
					</div>
					<div class="col-sm-4 x-p-0">
						<div class="col-sm-12 col-xs-6">
							<div class="yl-img x-dwr" style="width:60%; height:100px;"></div>
						</div>
						<div class="col-sm-12 col-xs-6 x-mt-10">
							<div class="yl-img x-dwr x-yuan" style="width:60%; height:100px;"></div>
						</div>
					</div>
            	</div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-primary " id="tijiao_btn" data-dismiss="modal" disabled>提交更改</button>
            </div>
        </div>
        </form>
    </div>
</div>


<script>
$(function () {
	$(".avatar-view").tooltip({placement:'bottom'});
    $('.timepicker').datetimepicker({
        format: 'YYYY-MM-DD',   //YYYY-MM-DD HH:mm:ss
        locale: moment.locale('zh-cn')
    });

	//上传头像
	var options = {
		aspectRatio: 1,
		preview: '.yl-img',//预览区域【avatar-preview】
        strict: true,   //不能裁剪图片之外的区域
        viewMode: 1,	//0没有限制(默认),1限制裁剪不超过图片的大小。
        dragMode: 'move', //crop 创建新的选区(默认),move 移动图片,none 图片和选区都不能移动
        autoCropArea: 1, 	//默认选取大小 0~1 之间
        guides: true,   //是否在剪裁框上显示虚线
        cropBoxMovable: true,   //是否允许移动剪裁框
        cropBoxResizable: true,   //是否允许改变剪裁框的大小
		crop: function(e) {
			//移动裁剪框发生的事件
			var dataobj = $img.cropper('getData');
			var datasit = JSON.stringify(dataobj);
			$('#scimg-data').val(datasit);
		}
	};

	$('#mytouxiang').on('show.bs.modal', function (event) {	//打开后执行
	  	var button = $(event.relatedTarget)
	  	var modalTitle = button.data('title');
	  	var modal = $(this);
		if( button.data('imgtype') == 'tx'){
			var tximg_type = $('<input name="dir" value="avatar" type="hidden"/>');
			var tximg_data = $('<input name="avatar_data" value="" id="scimg-data" type="hidden"/>');
			if( $("input[value='avatar']").length == 0 && $("input[name='avatar_data']").length == 0 ){
				modal.find('form').prepend(tximg_type,tximg_data);	//添加
			}
			modal.find('form').attr('action',"{:url('@index/Uploads/cropper')}");
			$('#tijiao_btn').addClass('submits');
		}else{
			var wximg_type = $('<input name="dir" value="image" type="hidden"/>');
			var wximg_data = $('<input name="image_data" value="" id="scimg-data" type="hidden"/>');
			var wximg_width = $('<input name="width" value="350" type="hidden"/>');
			var wximg_height = $('<input name="height" value="350" type="hidden"/>');
			if( $("input[value='image']").length == 0 && $("input[name='image_data']").length == 0  && $("input[name='width']").length == 0 && $("input[name='height']").length == 0){
				modal.find('form').prepend(wximg_type,wximg_data,wximg_width,wximg_height);	//添加
			}
			modal.find('form').attr('action',"{:url('@index/Uploads/cutimage')}");
			$('#tijiao_btn').addClass('scwximg_btn');
		}
		$('#tijiao_btn').attr('disabled',true);
	  	modal.find('.modal-title').text(modalTitle);
	})

	var URL = window.URL || window.webkitURL;
	var $img;
	var $inputImage = $('#inputImage');
	if(URL) {
		$inputImage.change(function() {
			$('#tijiao_btn').attr('disabled', false);
			var files = this.files;
//			console.log(files);
			var file;
			if(files && files.length) {
				file = files[0];
				if(/^image\/\w+$/.test(file.type)) {
					uploadedImageURL = URL.createObjectURL(file);
					$img = $('<img src=" ' + uploadedImageURL + '" class="x-img-auto" />');
					if($('#cjimgdata img').length > 0){
						$('#cjimgdata').empty();
					}
					$('#cjimgdata').append($img);
					$img.cropper('destroy').cropper(options);
				} else {
					xzyn.msg('请选择一个图像文件。');
				}
			}
		});
	}
	$('#mytouxiang').on('hidden.bs.modal', function (event) {	//关闭后执行
		$("input[value='image']").remove();	//删除
		$("input[name='image_data']").remove();	//删除
		$("input[name='width']").remove();	//删除
		$("input[name='height']").remove();	//删除
		$('#tijiao_btn').removeClass('scwximg_btn');//删除
		$("input[value='avatar']").remove();	//删除
		$("input[name='avatar_data']").remove();	//删除
		$('#tijiao_btn').removeClass('submits');//删除
		$('#cjimgdata img').cropper('destroy')//删除
		$('#cjimgdata').empty();//删除
	})

    //提交上传
    $('body').off('click', '.scwximg_btn');
    $('body').on("click", '.scwximg_btn', function(event){
        var _this = $(this);
        _this.button('loading');
        var form = _this.closest('form');
        if(form.length){
            var ajax_option={
                dataType:'json',
                success:function(data){
                    _this.button('reset');
//              	console.log(data);
                    if(data.status == '1'){
                    	var wximgurl = data.data.imgurl;
                    	var datas = {
                    		'id':		'{$user["id"]}',
                    		'actions':	'wximg',
                    		'wx_imgurl':data.data.imgurl
                    	}
                    	$.ajax({	//保存
                    	    url: "{:url('users/index')}", //请求url
                    	    type: "post",  //请求的类型
                    	    dataType: "json",  //数据类型
                    	    data: datas, //发送到服务器的数据
                    	    success:function(adata) { //成功后执行
//                  	        console.log(adata);
                    	        if(adata.status == '1'){
                    	        	xzyn.msg(adata.info);
                    				$('#dqwximg img').attr('src',wximgurl);
//                  	        	$.pjax({url: url, container: '#pjax-container', fragment:'#pjax-container'});
                    	        }else{
                    	        	xzyn.msg(adata.info);
                    	        }
                    	    },
                    	    error:function(adata) { //失败后执行
                    	        console.log(adata);
                    	    }
                    	});
                    }else{
                        _this.button('reset');
                        xzyn.msg(data.info);
                    }
                }
            }
            form.ajaxSubmit(ajax_option);
        }
    });

})
</script>


{/block}





